<div>
  <div class="widget-body">
    <div class="row">
      <form
        name="carForm"
        id="carForm"
        class="form-horizontal"
        (ngSubmit)="onSubmit()"
        novalidate="novalidate"
        [saBootstrapValidator]="validatorOptions"
      >
        <div class="col-sm-12">
          <div class="form-bootstrapWizard clearfix">
            <ul class="bootstrapWizard">
              <li *ngFor="let pane of steps; let i = index" [class.active]="activeStep == pane">
                <a>
                  <span class="step">
                    <span *ngIf="!pane.checked">{{ i + 1 }}</span>
                    <i class="fa fa-check" *ngIf="pane.checked"></i>
                  </span>
                  <span class="title">{{ pane.title }}</span>
                </a>
              </li>
            </ul>
          </div>
          <div class="tab-content">
            <div class="tab-pane" [class.active]="activeStep.key == 'step1'">
              <br />
              <h3 style="margin: 20px 0">
                <strong>1</strong>
                - 基本信息
              </h3>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">
                  所属公司
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <sa-company-tree
                    companyTreeId="companyTrees"
                    [Height]="32"
                    (companySelected)="companySelecteds($event)"
                  ></sa-company-tree>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">
                  设备ID
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="deviceId"
                      [(ngModel)]="page.deviceId"
                      type="text"
                      placeholder="载重设备ID"
                    />
                  </div>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">
                  车牌号码
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="carNumber"
                      [(ngModel)]="page.carNumber"
                      type="text"
                      placeholder="车牌号码"
                    />
                  </div>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">荷载重量</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="loadCapacity"
                      type="text"
                      [(ngModel)]="page.loadCapacity"
                      placeholder="汽车最大载重量"
                      autocomplete="address-level2"
                    />
                  </div>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">单位</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <select
                      class="form-control"
                      name="unit"
                      [ngModel]="page.unit"
                      (change)="unitChange($event.target.value)"
                      style="width: 100%"
                    >
                      <option value="">请选择</option>
                      <option *ngFor="let item of unitList" [value]="item.value">{{ item.label }}</option>
                    </select>
                  </div>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">
                  用途
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix s_fix_select2">
                    <select
                      class="form-control select2"
                      id="carTypeSelect2"
                      name="carUseType"
                      select2
                      style="width: 100%"
                    >
                      <option value="">请选择</option>
                      <optgroup *ngFor="let item of carTypeList" [label]="item.label">
                        <option *ngFor="let lis of item.children" [value]="lis.id">{{ lis.label }}</option>
                      </optgroup>
                    </select>
                  </div>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">GPS编码</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="gpsId"
                      type="text"
                      [(ngModel)]="page.gpsId"
                      placeholder="GPS编码"
                    />
                  </div>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">
                  拉货模式
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <label class="radio radio-inline" style="margin-right: 40px">
                    <input
                      type="radio"
                      class="radiobox"
                      checked
                      [(ngModel)]="page.isShared"
                      (change)="isSharedChange($event.target.value)"
                      value="0"
                      name="modal1"
                    />
                    <span>单厂区拉货</span>
                  </label>
                  <label class="radio radio-inline" style="margin-right: 40px">
                    <input
                      type="radio"
                      class="radiobox"
                      [(ngModel)]="page.isShared"
                      (change)="isSharedChange($event.target.value)"
                      value="1"
                      name="modal2"
                    />
                    <span>多厂区拉货</span>
                  </label>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">
                  设备类型
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <label class="radio radio-inline" style="margin-right: 40px">
                    <input
                      type="radio"
                      class="radiobox"
                      checked
                      [(ngModel)]="page.type"
                      (change)="deviceTypeChange($event.target.value)"
                      value="1"
                      name="type1"
                    />
                    <span>载重+北斗/GPS</span>
                  </label>
                  <label class="radio radio-inline" style="margin-right: 40px">
                    <input
                      type="radio"
                      class="radiobox"
                      [(ngModel)]="page.type"
                      (change)="deviceTypeChange($event.target.value)"
                      value="2"
                      name="type2"
                    />
                    <span>北斗/GPS</span>
                  </label>
                  <label class="radio radio-inline" style="margin-right: 40px">
                    <input
                      type="radio"
                      class="radiobox"
                      [(ngModel)]="page.type"
                      (change)="deviceTypeChange($event.target.value)"
                      value="3"
                      name="type3"
                    />
                    <span>北斗/GPS+摄像头</span>
                  </label>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">
                  安装人员
                </label>
                <div class="col-sm-10">
                  <div class="clearfix s_fix_select2">
                    <span class="versionInfo" style="margin-right:10px">
                      <i class="fa fa-question-circle" title="若录入该车辆数据的用户并非实际安装的实施人员，请选择正确的“安装人员”，以免发放薪酬补贴结算有误" style="color: #1A6DDD;font-size: 16px;cursor: pointer;"></i>
                    </span>
                    <input type="hidden" class="form-control" id="userNameForCreate" name="userNameForCreate" [(ngModel)]="page.userNameForCreate"/>
                    <div class="s_hover_box" style="width: 96%">
                      <select class="form-control select2" style="width: 100%" id="userSelect2">
                        <option value=""></option>
                      </select>
                      <div class="s_del_icon" (click)="delUserName()">x</div>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <div class="tab-pane" [class.active]="activeStep.key == 'step2'">
              <br />

              <h3 style="margin: 20px 0">
                <strong>2</strong>
                - 设备信息
              </h3>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">传感器类型</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <sa-sensor-type
                      (sensorSelected)="sensorSelected($event)"
                      Width="100%"
                      [sensorTypeId]="page.sensorType"
                      Height="32px"
                      [isShow]="false"
                      type="1"
                      [inputParam]="inputParam"
                      [isSendRequest]="false"
                    ></sa-sensor-type>
                  </div>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">传感器数量</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="sensorAmount"
                      type="text"
                      [(ngModel)]="page.sensorAmount"
                      placeholder="传感器数量"
                    />
                  </div>
                </div>
              </div>

              <div class="form-group sensorCH">
                <label class="control-label col-sm-1 no-padding-right">传感器</label>
                <div class="col-sm-10">
                  <div style="border: 1px solid #ccc; padding-bottom: 8px; padding-left: 12px">
                    <label class="checkbox-inline" *ngFor="let item of sensorArr">
                      <input
                        type="checkbox"
                        [value]="item.id"
                        [name]="item.text"
                        [(ngModel)]="item.checked"
                        class="checkbox style-0"
                        (change)="sensorChange(item.id, $event)"
                      />
                      <span>{{ item.text }}</span>
                    </label>
                  </div>
                </div>
              </div>
              <!-- 增加通道[前轴]，通道[后轴] -->
              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">通道[前轴]</label>
                <div class="col-sm-10">
                  <div class="passWay1">
                    <div *ngFor="let item of sensorAxleFront" style="display: inline-block; width: auto; height: auto">
                      <span
                        *ngIf="item.checked"
                        class="wayChannel wayCheck"
                        (click)="sensorAxleFrontChange1(item, $event)"
                      >
                        {{ item.text }}
                      </span>
                      <span *ngIf="item.isDisable" class="wayChannel wayDisable">{{ item.text }}</span>
                      <span
                        *ngIf="!item.isDisable && !item.checked"
                        class="wayChannel"
                        (click)="sensorAxleFrontChange1(item, $event)"
                      >
                        {{ item.text }}
                      </span>
                    </div>
                  </div>
                </div>
              </div>
              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">通道[后轴]</label>
                <div class="col-sm-10">
                  <div class="passWay2">
                    <div *ngFor="let item of sensorAxleAfter" style="display: inline-block; width: auto; height: auto">
                      <span
                        *ngIf="item.checked"
                        class="wayChannel wayCheck"
                        (click)="sensorAxleAfterChange1(item, $event)"
                      >
                        {{ item.text }}
                      </span>
                      <span *ngIf="item.isDisable" class="wayChannel wayDisable">{{ item.text }}</span>
                      <span
                        *ngIf="!item.isDisable && !item.checked"
                        class="wayChannel"
                        (click)="sensorAxleAfterChange1(item, $event)"
                      >
                        {{ item.text }}
                      </span>
                    </div>
                  </div>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">车轴数量</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="carAxleAmount"
                      id="carAxleAmount"
                      type="text"
                      [(ngModel)]="page.carAxleAmount"
                      placeholder="车轴数量"
                      (input)="carAxleAmountChange1($event.target.value)"
                    />
                  </div>
                </div>
              </div>

              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">安装位置</label>
                <div class="col-sm-10">
                  <div class="install">
                    <div class="install-contain" *ngIf="page.carAxleAmount != 0 || page.carAxleAmount == ''">
                      <table
                        class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table"
                      >
                        <thead>
                          <tr class="install-header">
                            <th></th>
                            <th>左</th>
                            <th>中</th>
                            <th>右</th>
                          </tr>
                        </thead>
                        <tbody>
                          <tr *ngFor="let row of installArray; let i = index" [attr.data-index]="i">
                            <td>轴{{ row.index }}</td>
                            <td>
                              <div class="installDiv install-L">
                                <span *ngFor="let channel of row.positionLMR[0].sensorChannel" class="mayChannel">
                                  {{ channel }}
                                  <i (click)="cancelChannel1(row.index, 'left', channel)">x</i>
                                </span>
                                <span class="add" (click)="addinstall1(row.index, 'left', installModal)">+</span>
                              </div>
                            </td>
                            <td>
                              <div class="installDiv install-M">
                                <span *ngFor="let channel of row.positionLMR[1].sensorChannel" class="mayChannel">
                                  {{ channel }}
                                  <i (click)="cancelChannel1(row.index, 'middle', channel)">x</i>
                                </span>
                                <span class="add" (click)="addinstall1(row.index, 'middle', installModal)">+</span>
                              </div>
                            </td>
                            <td>
                              <div class="installDiv install-R">
                                <span *ngFor="let channel of row.positionLMR[2].sensorChannel" class="mayChannel">
                                  {{ channel }}
                                  <i (click)="cancelChannel1(row.index, 'right', channel)">x</i>
                                </span>
                                <span class="add" (click)="addinstall1(row.index, 'right', installModal)">+</span>
                              </div>
                            </td>
                          </tr>
                        </tbody>
                      </table>
                    </div>
                  </div>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">硬件版本</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <!-- <select class="form-control" name="hwVersion" [(ngModel)]="page.hwVersion" (change)="hwVersionChange($event.target.value)" style="width: 100%">
                      <option value="">请选择</option>
                      <option *ngFor="let item of hwVersionList" [value]='item.value'>{{item.label}}</option>
                    </select> -->
                    <input
                      class="form-control"
                      name="hwVersion"
                      type="text"
                      [(ngModel)]="page.hwVersion"
                      placeholder="硬件版本号"
                    />
                  </div>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">SIM卡号</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input class="form-control" name="sim" type="text" [(ngModel)]="page.sim" placeholder="SIM卡号" />
                  </div>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">车辆类型</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="carType"
                      type="text"
                      [(ngModel)]="page.carType"
                      placeholder="车辆类型"
                    />
                  </div>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">GPS天线</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <select
                      class="form-control"
                      name="gpsAntenna"
                      [(ngModel)]="page.gpsAntenna"
                      style="width: 100%"
                      (change)="gpsAntennaChange($event.target.value)"
                    >
                      <option value="">请选择</option>
                      <option *ngFor="let gpsObj of gpsOptions" [value]="gpsObj.value">{{ gpsObj.text }}</option>
                    </select>
                  </div>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">GSM天线</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <select
                      class="form-control"
                      name="gsmAntenna"
                      [(ngModel)]="page.gsmAntenna"
                      style="width: 100%"
                      (change)="gsmAntennaChange($event.target.value)"
                    >
                      <option value="">请选择</option>
                      <option *ngFor="let gsmObj of gsmOptions" [value]="gsmObj.value">{{ gsmObj.text }}</option>
                    </select>
                  </div>
                </div>
              </div>
            </div>
            <div class="tab-pane" [class.active]="activeStep.key == 'step3'">
              <br />

              <h3 style="margin: 20px 0">
                <strong>3</strong>
                - 辅助信息
              </h3>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">车辆归属</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <select
                      class="form-control"
                      name="carAttribution"
                      [(ngModel)]="page.carAttribution"
                      style="width: 100%"
                      (change)="carAttributionChange($event.target.value)"
                    >
                      <option value="1">车队</option>
                      <option value="2">个人</option>
                      <option value="3">经销商</option>
                    </select>
                  </div>
                </div>
              </div>
              <div class="form-group clearfix" *ngIf="page.carAttribution == 1 || page.carAttribution == 3">
                <label class="control-label col-sm-1 no-padding-right">名称(车队/经销商)</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="motorcadeName"
                      type="text"
                      [(ngModel)]="page.motorcadeName"
                      placeholder="名称(车队/经销商)"
                    />
                  </div>
                </div>
              </div>
              <div class="form-group clearfix" *ngIf="page.carAttribution == 1 || page.carAttribution == 3">
                <label class="control-label col-sm-1 no-padding-right">联系人(车队/经销商)</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="motorcadeContact"
                      type="text"
                      [(ngModel)]="page.motorcadeContact"
                      placeholder="联系人(车队/经销商)"
                    />
                  </div>
                </div>
              </div>
              <div class="form-group clearfix" *ngIf="page.carAttribution == 1 || page.carAttribution == 3">
                <label class="control-label col-sm-1 no-padding-right">联系电话(车队/经销商)</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="motorcadeContactPhone"
                      type="text"
                      [(ngModel)]="page.motorcadeContactPhone"
                      placeholder="联系电话(车队/经销商)"
                    />
                  </div>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">司机姓名</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="driverName"
                      type="text"
                      [(ngModel)]="page.driverName"
                      placeholder="司机姓名"
                      autocomplete="tel-national"
                    />
                  </div>
                </div>
              </div>

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">司机电话</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="phone"
                      type="text"
                      [(ngModel)]="page.phone"
                      placeholder="联系电话"
                      autocomplete="tel-national"
                    />
                  </div>
                </div>
              </div>
              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">备注</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <textarea
                      class="form-control"
                      [(ngModel)]="page.remark"
                      name="remark"
                      rows="3"
                      cols="30"
                      placeholder="填写备注..."
                    ></textarea>
                  </div>
                </div>
              </div>

              <!-- <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">车辆图片</label>
                <div class="col-sm-10">
                  <button  type="button"  class="btn imgFile">{{imgFileTitle}}
                    <input type="file" class="up" title=" " placeholder=" " (change)="fileChange($event.target.files)"/>
                    <div class="headImg" >
                          <img id="img0" class="img"  [src]="fileImg" *ngIf="fileImg">
                      </div>
                  </button>
                </div>
              </div> -->

              <div class="form-group clearfix">
                <label class="control-label col-sm-1 no-padding-right">安装图片</label>
                <div class="col-sm-10">
                  <div class="imgFileList">
                    <!-- <div class="imgFileList-car">
                      <div class="imgFileList-main" *ngFor="let item of imageInfo">
                        <div *ngIf="item.index !=4 && item.index !=6 && item.index !=7">
                          <span class="control-label">{{item.text}}</span>
                          <div class="uploadlocation">
                            <button  type="button"  class="btn imgFile">{{item.imgFileTitle}}
                              <input type="file" class="up" title=" " placeholder=" " (change)="fileListChange(item.Indexes,$event.target.files)"/>
                              <div class="headImg" >
                                <div class="imgFileDeteleList" *ngIf="item.localImg !=0">
                                  <img class="img" *ngFor="let list of item.localImg"  [src]="list">
                                  <div class="deleteCont">
                                    <img class="bigImg" src="assets/img/bigImg.png" (click)="bigImgClick(ImgBigModal,item.localImg[0])" [attr.url]="item.localImg[0]"/>
                                    <i class="bigImg" (click)="bigImgClick(ImgBigModal,item.localImg[0])"></i>
                                    <i class="deleteImg" (click)="deleteImg(item.index,list)"></i>
                                  </div>
                                </div>
                              </div>
                            </button>
                          </div>
                        </div>
                        <div *ngIf="item.index ==4 || item.index ==6" style="display: none;"></div>
                      </div>
                    </div> -->
                    <div class="imgFileList-power">
                      <div class="imgFileList-multifile">
                        <span class="control-label">{{ imageInfo[0].text }}</span>
                        <div class="uploadlocation uploadlocation1">
                          <div class="content-list">
                            <div class="headImg" *ngFor="let item of imageInfo[0].localImg; let i = index">
                              <div class="contentImg">
                                <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                              </div>
                              <!-- <div class="deleteCont"> -->
                              <!-- <img class="bigImg" src="assets/img/bigImg.png"  (click)="bigImgClick(ImgBigModal,item)" [attr.url]="item"/> -->
                              <i class="deleteImg" (click)="deleteImg('1', i)"></i>
                              <!-- </div> -->
                            </div>
                            <button type="button" class="btn div_imgall">
                              <div class="div_shuline"></div>
                              <div class="div_hengline"></div>
                              <input
                                type="file"
                                class="up"
                                title=" "
                                placeholder=" "
                                multiple
                                (change)="multifileChange('0', $event.target.files)"
                              />
                            </button>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="imgFileList-power">
                      <div class="imgFileList-multifile">
                        <span class="control-label">{{ imageInfo[1].text }}</span>
                        <div class="uploadlocation uploadlocation1">
                          <div class="content-list">
                            <div class="headImg" *ngFor="let item of imageInfo[1].localImg; let i = index">
                              <div class="contentImg">
                                <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                              </div>
                              <!-- <div class="deleteCont">
                                <img class="bigImg" src="assets/img/bigImg.png" (click)="bigImgClick(ImgBigModal,item)" [attr.url]="item"/> -->
                              <i class="deleteImg" (click)="deleteImg('2', i)"></i>
                              <!-- </div> -->
                            </div>
                            <button type="button" class="btn div_imgall">
                              <div class="div_shuline"></div>
                              <div class="div_hengline"></div>
                              <input
                                type="file"
                                class="up"
                                title=" "
                                placeholder=" "
                                multiple
                                (change)="multifileChange('1', $event.target.files)"
                              />
                            </button>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="imgFileList-power">
                      <div class="imgFileList-multifile">
                        <span class="control-label">{{ imageInfo[2].text }}</span>
                        <div class="uploadlocation uploadlocation1">
                          <div class="content-list">
                            <div class="headImg" *ngFor="let item of imageInfo[2].localImg; let i = index">
                              <div class="contentImg">
                                <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                              </div>
                              <!-- <div class="deleteCont">
                                <img class="bigImg" src="assets/img/bigImg.png" (click)="bigImgClick(ImgBigModal,item)" [attr.url]="item"/> -->
                              <i class="deleteImg" (click)="deleteImg('3', i)"></i>
                              <!-- </div> -->
                            </div>
                            <button type="button" class="btn div_imgall">
                              <div class="div_shuline"></div>
                              <div class="div_hengline"></div>
                              <input
                                type="file"
                                class="up"
                                title=" "
                                placeholder=" "
                                multiple
                                (change)="multifileChange('2', $event.target.files)"
                              />
                            </button>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="imgFileList-power">
                      <div class="imgFileList-multifile">
                        <span class="control-label">{{ imageInfo[3].text }}</span>
                        <div class="uploadlocation uploadlocation1">
                          <div class="content-list">
                            <div class="headImg" *ngFor="let item of imageInfo[3].localImg; let i = index">
                              <div class="contentImg">
                                <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                              </div>
                              <!-- <div class="deleteCont">
                                <img class="bigImg" src="assets/img/bigImg.png" (click)="bigImgClick(ImgBigModal,item)" [attr.url]="item"/> -->
                              <i class="deleteImg" (click)="deleteImg('4', i)"></i>
                              <!-- </div> -->
                            </div>
                            <button type="button" class="btn div_imgall">
                              <div class="div_shuline"></div>
                              <div class="div_hengline"></div>
                              <input
                                type="file"
                                class="up"
                                title=" "
                                placeholder=" "
                                multiple
                                (change)="multifileChange('3', $event.target.files)"
                              />
                            </button>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="imgFileList-sensor">
                      <div class="imgFileList-multifile">
                        <span class="control-label">{{ imageInfo[4].text }}</span>
                        <div class="uploadlocation">
                          <div class="headImg" *ngFor="let item of imageInfo[4].localImg; let i = index">
                            <div class="contentImg">
                              <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                            </div>
                            <!-- <div class="deleteCont">
                              <img class="bigImg" src="assets/img/bigImg.png" (click)="bigImgClick(ImgBigModal,item)" [attr.url]="item"/> -->
                            <i class="deleteImg" (click)="deleteImg('5', i)"></i>
                            <!-- </div> -->
                          </div>
                          <button type="button" class="btn div_imgall">
                            <div class="div_shuline"></div>
                            <div class="div_hengline"></div>
                            <input
                              type="file"
                              class="up"
                              title=" "
                              placeholder=" "
                              multiple
                              (change)="multifileChange('4', $event.target.files)"
                            />
                          </button>
                        </div>
                      </div>
                    </div>
                    <div class="imgFileList-power">
                      <div class="imgFileList-multifile">
                        <span class="control-label">{{ imageInfo[6].text }}</span>
                        <div class="uploadlocation uploadlocation1" style="height: 140px">
                          <div class="content-list">
                            <div class="headImg" *ngFor="let item of imageInfo[6].localImg; let i = index">
                              <div class="contentImg">
                                <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                              </div>
                              <!-- <div class="deleteCont">
                                <img class="bigImg" src="assets/img/bigImg.png" (click)="bigImgClick(ImgBigModal,item)" [attr.url]="item"/> -->
                              <i class="deleteImg" (click)="deleteImg('7', i)"></i>
                              <!-- </div> -->
                            </div>
                            <button type="button" class="btn div_imgall">
                              <div class="div_shuline"></div>
                              <div class="div_hengline"></div>
                              <input
                                type="file"
                                class="up"
                                title=" "
                                placeholder=" "
                                multiple
                                (change)="multifileChange('6', $event.target.files)"
                              />
                            </button>
                          </div>
                        </div>
                      </div>
                      <p style="margin-bottom: 15px; color: red">
                        注意：请按照循序上传行驶证照片：行驶证主页(第一张)，行驶证副页(第二张)，行驶证副页反面(第三张)
                      </p>
                    </div>
                    <div class="imgFileList-power">
                      <div class="imgFileList-multifile">
                        <span class="control-label">{{ imageInfo[7].text }}</span>
                        <div class="uploadlocation uploadlocation1">
                          <div class="content-list">
                            <div class="headImg" *ngFor="let item of imageInfo[7].localImg; let i = index">
                              <div class="contentImg">
                                <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                              </div>
                              <!-- <div class="deleteCont">
                                <img class="bigImg" src="assets/img/bigImg.png" (click)="bigImgClick(ImgBigModal,item)" [attr.url]="item"/> -->
                              <i class="deleteImg" (click)="deleteImg('8', i)"></i>
                              <!-- </div> -->
                            </div>
                            <button type="button" class="btn div_imgall">
                              <div class="div_shuline"></div>
                              <div class="div_hengline"></div>
                              <input
                                type="file"
                                class="up"
                                title=" "
                                placeholder=" "
                                multiple
                                (change)="multifileChange('7', $event.target.files)"
                              />
                            </button>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="imgFileList-power">
                      <div class="imgFileList-multifile">
                        <span class="control-label">{{ imageInfo[5].text }}</span>
                        <div class="uploadlocation uploadlocation1">
                          <div class="content-list">
                            <div class="headImg" *ngFor="let item of imageInfo[5].localImg; let i = index">
                              <div class="contentImg">
                                <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                              </div>
                              <!-- <div class="deleteCont">
                                <img class="bigImg" src="assets/img/bigImg.png" (click)="bigImgClick(ImgBigModal,item)" [attr.url]="item"/> -->
                              <i class="deleteImg" (click)="deleteImg('6', i)"></i>
                              <!-- </div> -->
                            </div>
                            <button type="button" class="btn div_imgall">
                              <div class="div_shuline"></div>
                              <div class="div_hengline"></div>
                              <input
                                type="file"
                                class="up"
                                title=" "
                                placeholder=" "
                                multiple
                                (change)="multifileChange('5', $event.target.files)"
                              />
                            </button>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="imgFileList-other">
                      <div class="imgFileList-multifile">
                        <span class="control-label">{{ imageInfo[8].text }}</span>
                        <div class="uploadlocation uploadlocation1">
                          <div class="content-list">
                            <div class="headImg" *ngFor="let item of imageInfo[8].localImg; let i = index">
                              <div class="contentImg">
                                <img class="img" [src]="item" (click)="bigImgClick(ImgBigModal, item)" />
                              </div>
                              <!-- <div class="deleteCont">
                              <img class="bigImg" src="assets/img/bigImg.png" (click)="bigImgClick(ImgBigModal,item)" [attr.url]="item"/> -->
                              <i class="deleteImg" (click)="deleteImg('9', i)"></i>
                              <!-- </div> -->
                            </div>
                            <button type="button" class="btn div_imgall">
                              <div class="div_shuline"></div>
                              <div class="div_hengline"></div>
                              <input
                                type="file"
                                class="up"
                                title=" "
                                placeholder=" "
                                multiple
                                (change)="multifileChange('8', $event.target.files)"
                              />
                            </button>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="tab-pane" [class.active]="activeStep.key == 'step4'">
              <br />
              <h3 style="margin: 20px 0">
                <strong>Step 4</strong>
                - 上线检测
              </h3>
              <div class="isOnline_box clearfix">
                <span *ngIf="isOnline === 'OFF'">离线</span>
                <span *ngIf="isOnline === 'ON'">在线</span>
                <div
                  class="default_circle left"
                  [ngClass]="{ online: isOnline === 'ON', unline: isOnline === 'OFF' }"
                  (click)="getIsOnline()"
                  title="点击刷新最新状态"
                >
                  <i class="glyphicon glyphicon-refresh"></i>
                </div>
                <!--<span class="btn btn-primary left" (click)='getIsOnline()' style="padding: 3px 12px;min-width: 46px;margin: 16px 0 0 24px;">刷新</span>-->
              </div>
            </div>
            <div class="tab-pane" [class.active]="activeStep.key == 'step5'">
              <br />
              <h3 style="margin: 20px 0">
                <strong>Step 5</strong>
                - 安装记录
              </h3>

              <!--<form  id="recordForm"  class="form-horizontal" (ngSubmit)="onSubmit()" novalidate="novalidate" [saBootstrapValidator]="installValidatorOptions">-->
              <div class="form-group s_fix_select2">
                <label class="control-label col-sm-1 no-padding-right">
                  车牌号码
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      type="hidden"
                      class="form-control"
                      id="carNumberInput"
                      name="carNumberInput"
                      [(ngModel)]="installPage.carNumber"
                    />
                    <select class="select2 form-control" style="width: 100%" id="carNumberSelect2">
                      <option value=""></option>
                    </select>
                  </div>
                </div>
              </div>

              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">
                  打磨清洗
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix fix_select2">
                    <input
                      type="hidden"
                      class="form-control"
                      id="polishInstallerInput"
                      name="polishInstallerInput"
                      [(ngModel)]="installPage.polishInstaller"
                    />
                    <select
                      id="polishSelect2"
                      style="width: 100%"
                      name="polishInstaller"
                      class="form-control select2"
                      multiple
                    ></select>
                  </div>
                </div>
              </div>

              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">
                  贴片
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix fix_select2">
                    <input
                      type="hidden"
                      class="form-control"
                      id="patchInstallerInput"
                      name="patchInstallerInput"
                      [(ngModel)]="installPage.patchInstaller"
                    />
                    <select
                      id="patchSelect2"
                      style="width: 100%"
                      name="patchInstaller"
                      class="form-control select2"
                      multiple
                    ></select>
                  </div>
                </div>
              </div>

              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">
                  封胶
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix fix_select2">
                    <input
                      type="hidden"
                      class="form-control"
                      id="sealantInstallerInput"
                      name="sealantInstallerInput"
                      [(ngModel)]="installPage.sealantInstaller"
                    />
                    <select
                      id="sealantSelect2"
                      style="width: 100%"
                      name="sealantInstaller"
                      class="form-control select2"
                      multiple
                    ></select>
                  </div>
                </div>
              </div>

              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">
                  穿线
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix fix_select2">
                    <input
                      type="hidden"
                      class="form-control"
                      id="threadingInstallerInput"
                      name="threadingInstallerInput"
                      [(ngModel)]="installPage.threadingInstaller"
                    />
                    <select
                      id="threadingSelect2"
                      style="width: 100%"
                      name="threadingInstaller"
                      class="form-control select2"
                      multiple
                    ></select>
                  </div>
                </div>
              </div>

              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">
                  主机
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix fix_select2">
                    <input
                      type="hidden"
                      class="form-control"
                      id="hostInstallerInput"
                      name="hostInstallerInput"
                      [(ngModel)]="installPage.hostInstaller"
                    />
                    <select
                      id="hostSelect2"
                      style="width: 100%"
                      name="hostInstaller"
                      class="form-control select2"
                      multiple
                    ></select>
                  </div>
                </div>
              </div>

              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">
                  开始安装时间
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="startInstallTime"
                      id="startInstallTime"
                      autocomplete="off"
                      [(ngModel)]="installPage.startInstallTime"
                      type="text"
                      placeholder="请选择"
                    />
                  </div>
                </div>
              </div>

              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">
                  完成安装时间
                  <sup>*</sup>
                </label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="installTime"
                      id="installTime"
                      autocomplete="off"
                      [(ngModel)]="installPage.installTime"
                      type="text"
                      placeholder="请选择"
                    />
                  </div>
                </div>
              </div>

              <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right">安装地址</label>
                <div class="col-sm-10">
                  <div class="clearfix">
                    <input
                      class="form-control"
                      name="installAddress"
                      [(ngModel)]="installPage.installAddress"
                      type="text"
                      placeholder="安装地址"
                      autocomplete="street-address"
                    />
                  </div>
                </div>
              </div>
              <!--</form>-->
            </div>
            <div class="form-actions" style="background-color: transparent">
              <div class="row">
                <div class="col-sm-12">
                  <ul class="pager wizard no-margin">
                    <li class="blueBtn" *ngIf="activeStep.key === 'step4'">
                      <a
                        (click)="backToCarList()"
                        [class.disabled]="activeStep.submitted && !activeStep.valid"
                        class="btn btn-default"
                      >
                        返回车辆管理
                      </a>
                    </li>
                    <li class="blueBtn" *ngIf="activeStep.key != 'step4' && activeStep.key != 'step5'">
                      <a (click)="prevStep()" [class.disabled]="steps.indexOf(activeStep) == 0" class="btn btn-default">
                        上一步
                      </a>
                    </li>
                    <li class="blueBtn" *ngIf="activeStep.key != 'step4' && activeStep.key != 'step5'">
                      <a (click)="saveStep()" class="btn btn-default">保存</a>
                    </li>
                    <li class="blueBtn" *ngIf="activeStep.key === 'step5'">
                      <a (click)="saveInstallDevice()" class="btn btn-default">保存</a>
                    </li>
                    <li
                      class="blueBtn"
                      *ngIf="activeStep.key != 'step4' && activeStep.key != 'step3' && activeStep.key != 'step5'"
                    >
                      <!--<button  (click)="nextStep()" class="btn btn-default">保存</button>-->
                      <a
                        (click)="nextStep()"
                        [class.disabled]="activeStep.submitted && !activeStep.valid && flag"
                        class="btn btn-default"
                      >
                        下一步
                      </a>
                    </li>
                    <li class="blueBtn" *ngIf="activeStep.key === 'step4'">
                      <a (click)="nextStep()" class="btn btn-default">添加安装记录</a>
                    </li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>
      </form>
    </div>
  </div>
  <!--  传感器通道弹窗-->
  <div
    bsModal
    #installModal="bs-modal"
    id="lgModal"
    class="modal fade"
    tabindex="-1"
    role="dialog"
    aria-labelledby="myLargeModalLabel"
    aria-hidden="true"
  >
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" (click)="lgModalhide1(installModal)" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">传感器通道</h4>
        </div>
        <div class="modal-body">
          <div class="row">
            <form class="form form-inline" role="form">
              <div class="row">
                <div class="form-group">
                  <label class="control-label" style="margin-right: 10px">传感器:</label>
                  <div class="inline_block checkChannel" *ngFor="let item of checkChannel">
                    <span *ngIf="item.checked" class="channel check" (click)="choiceChannel(item, $event)">
                      {{ item.text }}
                    </span>
                    <span *ngIf="item.isDisable" class="channel disable">{{ item.text }}</span>
                    <span
                      *ngIf="!item.isDisable && !item.checked"
                      class="channel"
                      (click)="choiceChannel(item, $event)"
                    >
                      {{ item.text }}
                    </span>
                  </div>
                </div>
              </div>
            </form>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" (click)="lgModalhide1(installModal)">取消</button>
          <button type="button" class="btn btn-primary" (click)="lgModalConfirm1(installModal)">确认</button>
        </div>
      </div>
    </div>
  </div>
  <!--弹窗end-->
  <!-- 图片放大查看   弹窗-->
  <section
    bsModal
    #ImgBigModal="bs-modal"
    class="modal fade imgView"
    tabindex="-1"
    role="dialog"
    aria-labelledby="myLargeModalLabel"
    aria-hidden="true"
  >
    <!-- <div class="closeImg" (click)="CloseBigImg(ImgBigModal)"></div> -->
    <div class="modal-content modal-imgContent" (click)="CloseBigImg(ImgBigModal)">
      <img [src]="bigImg" />
    </div>
  </section>
  <!-- 图片放大查看 弹窗end-->
</div>
